<!-- 拒保弹框 -->
<template>
    <div>
        <el-dialog v-model="showDialog" title="导出" width="500">
            <div class="flex items-center">
                <div>请选择月份：</div>
                <el-date-picker v-model="selectMonth" type="monthrange" start-placeholder="请选择"
                end-placeholder="请选择" value-format="YYYY-MM" />
            </div>
            <div class="flex items-center flex-jc-c mg-t-20">
                <el-button @click="onCancel">取消</el-button>
                <el-button type="primary" @click="onConfirm">确定</el-button>
            </div>
        </el-dialog>
    </div>
</template>
<script lang="ts" setup>
import { ElMessage } from 'element-plus'
import { ref, watch } from 'vue'
import { cexportaccountdetailsapi } from '@/api/api'
import baseurl from '@/api/env'

const props = defineProps({
    show: {
        type: Boolean,
        default: false
    },
    query: {
        type: Object,
        default() {
            return {}
        }
    }
})

const selectMonth = ref([])

const emits = defineEmits(['update:show', 'success'])

const showDialog = ref(false)

const onCancel = () => {
    showDialog.value = false
}

const onConfirm = async () => {
    if (selectMonth.value.length === 0) {
        ElMessage.error('请选择月份')
        return
    }
    const res = await cexportaccountdetailsapi({
        ...props.query,
        startMonth: selectMonth.value[0],
        endMonth: selectMonth.value[1]
    })

    const a = document.createElement('a')
    a.href = baseurl + '/common/download?delete=true&fileName=' + res
    a.download = baseurl + '/common/download?delete=true&fileName=' + res
    a.style.display = 'none'
    document.body.appendChild(a)
    a.click()
    document.body.removeChild(a)
    onCancel()
}

watch(() => props.show, (newval) => {
    showDialog.value = newval
})

watch(showDialog, (newval) => {
    emits('update:show', newval)
})
</script>
<style lang="scss" scoped></style>